var gmarkers = [];
var w_i = 0;
var j;
var map_is_loaded ="no";
var baseIcon;
var icon;
var marker;
var map;
var bounds;
var point_message;
var xml_data;
var xml;
var markers;
var extend_bounds="yes";
var lat;
var long;
var point_link;
var point_id;
var curDateTime;
var tooltip;
var greenCross;
var own_offset_x =0;
var own_offset_y =0;
var ad;
var point;
var offset;
var anchor;
var width;
var height;
var pos;
var map_southwest;
var map_southwest_lat;
var map_southwest_long;
var map_center;
var map_center_lat;
var map_center_long ;
var marker_position;
var marker_lat;
var marker_long;
var map_lat_dif
var map_long_dif;
var marker_lat_dif;
var marker_long_dif;
var marker_offset_lat;
var marker_offset_long;
// mymouseover
function mymouseover(w_i,own_offset_x,own_offset_y,ad){
if (map_is_loaded=="yes"){
map_movements_listener="off";
if (w_i!=1000 && ad!="yes"){document.getElementById('venue_'+w_i).style.backgroundColor='#efe6da';}
pan_if_outside(gmarkers[w_i]);
showTooltip(gmarkers[w_i],own_offset_x,own_offset_y);
if (w_i!=1000){gmarkers[w_i].setImage('http://www.allakartor.se/mapicons/red_dot.png'); }
if (w_i==1000){map_movements_listener="on";window.setTimeout('tooltip.style.visibility="hidden";',15000);}
}
}
// mymouseout
function mymouseout(w_i,ad){
if(map_is_loaded=="yes"){if(ad!="yes"){document.getElementById('venue_'+w_i).style.backgroundColor='#ffffff';}
tooltip.style.visibility='hidden';
gmarkers[w_i].setImage('http://www.allakartor.se/mapicons/yellow_light.png');
map_movements_listener="on";
ad="no";
}
}
// SHOW INITIAL TOOLTIP
function show_initial_tooltip(){
window.setTimeout('showTooltip(gmarkers[1000],-50,-50);hide_initial_tooltip();',1500);
}
// HIDE INITIAL TOOLTIP
function hide_initial_tooltip(){
window.setTimeout('tooltip.style.visibility="hidden";',15000);
}
// A function to create the marker and set up the event window
function createMarker(point,point_message,point_link,point_id){
var icon = new GIcon(baseIcon);
icon.image = "http://www.allakartor.se/mapicons/yellow_light.png";
var marker = new GMarker(point, icon);
// === store the name so that the tooltip function can use it ===
marker.tooltip = '';
gmarkers[w_i] = marker;
w_i++;
map.addOverlay(marker);
// --- ADD LISTENERS ---
// --- MOUSE OVER ---
GEvent.addListener(marker,'mouseover', function(){
showTooltip(marker,-40,0); // show tooltip
marker.setImage('http://www.allakartor.se/mapicons/red_dot.png'); // change icon
if (map_is_loaded=="yes"){ document.getElementById('venue_' + point_id).style.backgroundColor='#EFE6DA'; } // change li style
});
// --- MOUSE OUT ---
GEvent.addListener(marker,'mouseout', function(){
tooltip.style.visibility='hidden'; // hide tooltip
marker.setImage('http://www.allakartor.se/mapicons/yellow_light.png'); // change icon
if (map_is_loaded=="yes"){ document.getElementById('venue_' + point_id).style.backgroundColor='#FFFFFF'; } // change li style
});
// --- GO TO LINK ON CLICK ---
GEvent.addListener(marker, 'click', function(){top.location.href = point_link;});
// --- END LISTENERS ---
}
// A function to create the green cross
function createGreenCross(point,point_message){
var icon = new GIcon(greenCross);
var marker = new GMarker(point, icon);
gmarkers[1000] = marker;
// === store the name so that the tooltip function can use it ===
marker.tooltip = '';
map.addOverlay(marker);
// --- ADD LISTENERS ---
// --- MOUSE OVER ---
GEvent.addListener(marker,'mouseover', function(){
showTooltip(marker,-50,0); // show tooltip
});
// --- MOUSE OUT ---
GEvent.addListener(marker,'mouseout', function(){
tooltip.style.visibility='hidden'; // hide tooltip
});
// --- END LISTENERS ---
}
// === TOOLTIP FUNCTION STARTS =========
function showTooltip(marker,own_offset_x,own_offset_y){
tooltip.innerHTML = marker.tooltip;
point=map.getCurrentMapType().getProjection().fromLatLngToPixel(map.fromDivPixelToLatLng(new GPoint(0,0),true),map.getZoom());
offset=map.getCurrentMapType().getProjection().fromLatLngToPixel(marker.getPoint(),map.getZoom());
anchor=marker.getIcon().iconAnchor;
width=marker.getIcon().iconSize.width;
height=tooltip.clientHeight;
pos = new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(offset.x - point.x - anchor.x + width + own_offset_x, offset.y - point.y -anchor.y -height + own_offset_y));
pos.apply(tooltip);
tooltip.style.visibility="visible";
}
// === TOOLTIP FUNCTION ENDS =========
// === PAN-IF-OUTSIDE STARTS ===
function pan_if_outside(marker){
map_southwest = map.getBounds().getSouthWest().toString();
map_southwest = map_southwest.split(",");
map_southwest_lat = map_southwest[0].replace("(", "").replace(" ","");
map_southwest_long = map_southwest[1].replace(")", "").replace(" ","");
map_center = map.getCenter().toString();
map_center = map_center.split(",");
map_center_lat = map_center[0].replace("(", "").replace(" ","");
map_center_long = map_center[1].replace(")", "").replace(" ","");
marker_position = marker.getPoint().toString();
marker_position = marker_position.split(",");
marker_lat = marker_position[0].replace("(", "").replace(" ","");
marker_long = marker_position[1].replace(")", "").replace(" ","");
map_lat_dif = map_center_lat - map_southwest_lat;
map_long_dif = map_center_long - map_southwest_long;
marker_lat_dif = map_center_lat - marker_lat;
marker_long_dif = map_center_long - marker_long;
marker_offset_lat = marker_lat_dif / map_lat_dif;
marker_offset_long = marker_long_dif / map_long_dif;
if ( (marker_offset_lat < -0.6) && (marker_offset_long < 0) || (marker_offset_lat < 0) && (marker_offset_long < -0.7)) // Less so we can see the text to the top and right
{
map.panTo(new GLatLng((1*marker_lat-1*(map_lat_dif/2)), (1*marker_long-1*(map_long_dif/4)))); // So we can see the text to the right
}
if ( (marker_offset_lat < -0.6) && (marker_offset_long > 0) || (marker_offset_lat < 0) && (marker_offset_long > 0.75)) // Less because the controls are in the way here
{
map.panTo(new GLatLng((1*marker_lat-1*(map_lat_dif/2)), (1*marker_long+1*(map_long_dif/2))));
}
if ( (marker_offset_lat > 0.9) && (marker_offset_long < 0) || (marker_offset_lat > 0) && (marker_offset_long < -0.7)) // Less so we can see the text to the right
{
map.panTo(new GLatLng((1*marker_lat+1*(map_lat_dif/2)), (1*marker_long-1*(map_long_dif/4)))); // So we can see the text to the right
}
if ( (marker_offset_lat > 0.9) && (marker_offset_long > 0) || (marker_offset_lat > 0) && (marker_offset_long > 0.9))
{
map.panTo(new GLatLng((1*marker_lat+1*(map_lat_dif/2)), (1*marker_long+1*(map_long_dif/2))));
}
}
// === PAN IF OUTSIDE ENDS ===
// loop markers
function loop_markers(which_webpage){
xml = GXml.parse(xml_data);
markers = xml.documentElement.getElementsByTagName("marker");
// --- FOR EACH MARKER, ADD OVERLAY ---
for (j = 0; j < markers.length; j++){
// obtain the attribues of each marker
lat = parseFloat(markers[j].getAttribute("lat"));
long = parseFloat(markers[j].getAttribute("long"));
point = new GLatLng(lat,long);
point_link = markers[j].getAttribute("point_link");
// create the marker
point_id = j;
point_message = markers[j].getAttribute("point_message");
marker = createMarker(point,point_message,point_link,point_id);
if (extend_bounds=="yes"){bounds.extend(point);}
}
if (j>0 && extend_bounds=="yes"){ map.setCenter(bounds.getCenter()); }// map-to-fit
if ((j>1 && extend_bounds=="yes") || (which_webpage=="Annonskartan.se")){ map.setZoom(map.getBoundsZoomLevel(bounds)); }// map-to-fit
// WE WANT TO EXTEND THE MAP A LITTLE MORE:
map_southwest = map.getBounds().getSouthWest().toString();
map_southwest = map_southwest.split(",");
map_southwest_lat = map_southwest[0].replace("(", "").replace(" ","");
map_southwest_long = map_southwest[1].replace(")", "").replace(" ","");
map_center = map.getCenter().toString();
map_center = map_center.split(",");
map_center_lat = map_center[0].replace("(", "").replace(" ","");
map_center_long = map_center[1].replace(")", "").replace(" ","");
map_lat_dif = map_center_lat - map_southwest_lat;
map_long_dif = map_center_long - map_southwest_long;
map_extend_lat = (map_center_lat)*1 + (map_lat_dif)*100/80;
map_extend_long = (map_center_long)*1 + (map_long_dif)*100/80;
bounds.extend(new GLatLng(map_extend_lat,map_extend_long));
if (j>0 && extend_bounds=="yes"){
if (map.getBoundsZoomLevel(bounds)!=0){map.setZoom(map.getBoundsZoomLevel(bounds));}else{map.setZoom(1);}
}
if (j==0 && extend_bounds=="yes"){map.setZoom(4);}
}
var hotellkartan_map_div=" Top 10 hotell i Sverige enligt Hotellkartan.se: ";
document.getElementById("hotellkartan_map_div").innerHTML = hotellkartan_map_div;
venue_type_plural = "hotell";
// --- Create a base icon for our markers that specifies shadow, dimensions, etc ---
baseIcon = new GIcon();
baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
baseIcon.iconSize = new GSize(20, 34);
baseIcon.shadowSize = new GSize(37, 34);
baseIcon.iconAnchor = new GPoint(9, 34);
baseIcon.infoWindowAnchor = new GPoint(9, 2);
baseIcon.infoShadowAnchor = new GPoint(18, 25);
// create the map...
map = new GMap2(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.setCenter(new GLatLng(60.12816100,18.64350100), 8);
bounds = new GLatLngBounds(); // needed for map-to-fit
bounds.extend(new GLatLng(60.12816100,18.64350100)); // map-to-fit
// ====== set up marker mouseover tooltip div ======
tooltip = document.createElement("div");
map.getPane(G_MAP_FLOAT_PANE).appendChild(tooltip);
tooltip.style.visibility="hidden";
// --- HERE WE DEFINE OUR MARKER DATA, AS XML ---
xml_data = "";
loop_markers();
// NOW THE MAP IS LOADED
map_is_loaded="yes";